<page-header title="产品组合" [breadcrumb]="breadcrumb" [action]="action">
  <ng-template #breadcrumb>
    <ql-breadcrumb>
      <ql-breadcrumb-item>产品管理</ql-breadcrumb-item>
      <ql-breadcrumb-item>产品组合</ql-breadcrumb-item>
    </ql-breadcrumb>
  </ng-template>
  <ng-template #action>
    <ql-button type="primary" [routerLink]="['/product/combo-create']">新建产品组合</ql-button>
  </ng-template>
</page-header>

<page-container>
  <data-form label-width="100px" (submit)="onRefresh()">
    <ql-form-item label="产品组合名称">
      <ql-input [(ngModel)]="groupname"></ql-input>
    </ql-form-item>
    <ql-form-item label="产品组合代码">
      <ql-input [(ngModel)]="groupcode"></ql-input>
    </ql-form-item>
    <ql-form-item label="产品类别" >
      <ql-select [(ngModel)]="productcategory">
        <ql-option *ngFor="let item of dictService.getDict('product_category')" [label]="item.paramLabel" [value]="item.paramValue"></ql-option>
        <!--<ql-option *ngFor="let item of productTypes" [label]="item.label" [value]="item.value"> </ql-option>-->
      </ql-select>
    </ql-form-item>
    <ql-form-item label="销售状态">
      <ql-select [(ngModel)]="salestate">
        <ql-option *ngFor="let item of dictService.getDict('sale_state')" [label]="item.paramLabel" [value]="item.paramValue"></ql-option>

        <!--<ql-option *ngFor="let item of []" [label]="item.label" [value]="item.value"> </ql-option>-->
      </ql-select>
    </ql-form-item>
  </data-form>
  <data-table [model]="comboList"  [cursor]="cursorService"
              (cursor-change)="onRefresh()">
    <ql-table-column model-key="groupname" label="产品名称"></ql-table-column>
    <ql-table-column model-key="groupcode" label="产品代码"></ql-table-column>
    <ql-table-column model-key="risklevel" label="最高风险等级"></ql-table-column>
    <ql-table-column model-key="expectminratio" label="预期收益率"></ql-table-column>
    <ql-table-column model-key="lastupdatetime" label="最近更新时间"></ql-table-column>
    <ql-table-column model-key="status" label="销售状态">
      <ng-template #slot let-scope="scope">
        {{scope.rowData.status | dict:'sale_state'}}
      </ng-template>
    </ql-table-column>
    <ql-table-column label="操作" width="250px">
      <ng-template #slot let-scope="scope">
        <ql-button type="text" (click)="pull(scope.rowData.groupcode)">上架</ql-button>
        <ql-button type="text" (click)="stop(scope.rowData.groupcode)">停用</ql-button>
        <ql-button type="text" (click)="delFun(scope.rowData.groupcode)">删除</ql-button>
        <ql-button type="text" [routerLink]="['/product/combo-detail', {id: scope.rowData.groupcode }]">查看详情</ql-button>
      </ng-template>
    </ql-table-column>
  </data-table>
</page-container>
